<template>
  <div v-show="now" id="my-ad">
    <!-- 点击关闭广告 -->
    <span @click="now = false"></span>
    <!-- 点击广告后需要跳转的路由 -->
    <a href=""></a>
  </div>
</template>

<script>
export default {
  data() {
    return {
      now: true,
    };
  },
};
</script>

<style lang="scss" scoped>
#my-ad {
  width: 200px;
  height: 200px;
  position: fixed;
  z-index: 10;
  bottom: 10px;
  right: 10px;
  background: url("/public/广告.png");
  background-repeat: no-repeat;
  background-position-x: 50%;
  background-size: 200px 200px;

  > span {
    position: absolute;
    right: 5px;
    top: 5px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    z-index: 9;

    > a {
      text-decoration: none;
      color: #333;
    }
  }
}
</style>